<template>
	<view>
		<view class="header flex">
			<image src="../../static/icons/transfer/success.png"></image><text>{{pageTpye=='publishOK'?'发布成功':'委托成功，等待对方确认'}}</text>
		</view>
		<view class="put-prod" v-if="pageTpye=='publishOK'">
			<view class="img" v-if="image">
				<image :src="image"></image>
			</view>
			<view class="ohter-btns flex">
				<navigator open-type="navigate" class="again-btn" url="/pages/transfer/transfer_publish">再发一条</navigator>
				<navigator open-type="navigate" class="again-btn" url="/pages/transfer/publish_list">我的发布</navigator>
				<navigator open-type="navigate" class="again-btn" url="/pages/transfer/transfer_list">返回首页</navigator>
			</view>
		</view>
		<view class="put-prod" v-if="pageTpye=='orderOK'">
			<view class="ohter-btns flex">
				<navigator open-type="navigate" class="again-btn" url="/pages/transfer/buyer_list?pageType=1">我买到的</navigator>
				<navigator open-type="navigate" class="again-btn" url="/pages/transfer/transfer_list">返回首页</navigator>
			</view>
		</view>
		<view class="prod-list" v-if="favorite_data.length > 0">
			<view class="list-title">猜你喜欢</view>
			<navigator open-type="navigate" class="item flex" :url="'/pages/transfer/transfer_view?id='+item.id" v-for="(item, index) in favorite_data" :key="index">
				<view class="pic"><image :src="item.photos_text[0]" mode="aspectFit"></image></view>
				<view class="info">
					<view class="name">{{item.title}}</view>
					<!-- <view class="price"><text class="rmb">¥</text>{{item.buyout_price}}</view> -->
					<view class="other flex">
						<text class="text">{{item.is_new_text}}</text>
						<text class="address" v-if="item.city">{{item.city}} | {{item.zone}}</text>
					</view>
					<view class="content">{{item.content}}</view>
				</view>
			</navigator>
		</view>
		<view class="m-full-loading" v-if="bIsShowLoading">
			<view class="m-loading">
				<image src="../../static/images/loading.gif" mode="widthFix"></image>
			</view>
		</view>
	</view>
</template>

<script>
	import henglang from '@/common/common.js';
	export default {
	    data() {
			return {
				bIsShowLoading: false,
				favorite_data: [],
				transfer_list: [],
				shareData:{},
				image:'',
				pageTpye:''
			}
		},
		methods: {
			share(type, wx = '') { // 调用分享
				let that = this
				that.bIsShowLoading = true;
				uni.share({
			        provider: type,
			        scene: wx,
			        type: 0,
			        href: that.shareData.url,
			        title: that.shareData.title,
			        summary: that.shareData.description,
			        imageUrl: that.shareData.thumb,
			        success: function(res) {
						that.bIsShowLoading = false
					},
			        fail: function(err) {
						that.bIsShowLoading = false
					}
			    });
				setTimeout(() => {
					that.bIsShowLoading = false;
				}, 3000)
			},
			back(){
				uni.navigateBack({
					delta:1
				})
			}
		},
		onLoad(options) {
			let that = this;
			that.pageTpye = options.pageTpye
			that.bIsShowLoading = true;
			if(that.pageTpye == 'publishOK'){
				new Promise((resolve, reject) => {
					henglang.get('Pawn/transfer_view', {id: options.id}, false, function (res){
						let resdata = res.data;
						that.bIsShowLoading = false;
						if(resdata.code == '-1') {
							henglang.showToast(resdata.msg);
							setTimeout(function (){
								uni.redirectTo({
								    url: '/pages/transfer/transfer_list'
								});
							}, 1500);
						}else{
							that.transfer_data = resdata;
							that.image = resdata.video_src?'':that.transfer_data.photos_text[0]
							resolve();
						}
					})
				}).then(() => {
					henglang.get('Pawn/guess_ur_favorites', {}, false, function (res){
						that.favorite_data = res.data.data;
					})
				})
			}else{
				that.bIsShowLoading = false;
				henglang.get('Pawn/guess_ur_favorites', {}, false, function (res){
					that.favorite_data = res.data.data;
				})
			}
		}
	}
</script>
<style>
	page{
		background: #f5f5f5;
	}
	.flex{
		display: flex;
		align-items: center;
	}
	.header{
		height: 195rpx;
		background: #f06060;
		width: 100%;
		justify-content: center;
		font-size: 46rpx;
		color: #FFFFFF;
		overflow: hidden;
		position: relative;
		z-index: 1;
	}
	.header:after{
		content: '';
		position: absolute;
		width: 140rpx;
		height: 140rpx;
		background: rgba(255,255,255,.09);
		left: -40rpx;
		top: -40rpx;
		border-radius: 50%;
		z-index: 0;
	}
	.header:before{
		content: '';
		position: absolute;
		width: 100rpx;
		height: 100rpx;
		background: rgba(255,255,255,.09);
		right: 100rpx;
		bottom: -50rpx;
		border-radius: 50%;
		z-index: 0;
	}
	.header image{
		width: 65rpx;
		height: 65rpx;
		display: block;
		margin-right: 25rpx;
	}
	.put-prod {
		background: #FFFFFF;
		padding-top: 55rpx;
		padding-bottom: 45rpx;
	}
	.put-prod .img{
		width: 378rpx;
		height: 378rpx;
		margin: 0 auto;
		border-radius: 20rpx;
		overflow: hidden;
		position: relative;
		margin-bottom: 35rpx;
	}
	.put-prod .img image{
		width: 100%;
		height: 100%;
		display: block;
	}
	.put-prod .img .text{
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		background: rgba(0,0,0,0.48);
		text-align: center;
		color: #FFFFFF;
		font-size: 40rpx;
		line-height: 100rpx;
	}
	.put-prod .share-way{
		justify-content: center;
	}
	.put-prod .share-way .item{
		margin: 0 50rpx;
	}
	.put-prod .share-way image{
		width: 70rpx;
		height: 70rpx;
		display: block;
		margin: 0 auto;
	}
	.put-prod .share-way text{
		color: #808080;
		font-size: 28rpx;
	}
	.put-prod .ohter-btns{
		justify-content: center;
	}
	.put-prod .again-btn{
		width: 180rpx;
		height: 66rpx;
		border: 1px solid #4c4c4c;
		text-align: center;
		line-height: 66rpx;
		border-radius: 10rpx;
		color: #4c4c4c;
		font-size: 32rpx;
		margin: 0 20rpx;
		margin-top: 80rpx;
	}
	.prod-list{
		background: #FFFFFF;
		margin-top: 20rpx;
		padding: 0 22rpx;
	}
	.prod-list .list-title{
		color: #4c4c4c;
		font-size: 36rpx;
		position: relative;
		padding-left: 20rpx;
		line-height: 116rpx;
	}
	.prod-list .list-title:after{
		content: '';
		position: absolute;
		left: 0;
		top: 50%;
		height: 30rpx;
		width: 4rpx;
		background: #f06060;
		margin-top: -15rpx;
	}
	.prod-list .item{
		box-sizing: border-box;
		padding: 16rpx;
		width: 100%;
		border-radius: 10rpx;
		box-shadow:0rpx 1rpx 24rpx rgba(134,134,134,0.11);
		justify-content: space-between;
		align-items: flex-start;
		margin-bottom: 20rpx;
	}
	.prod-list .item .pic{
		height: 176rpx;
		width: 176rpx;
		border-radius: 10rpx;
		overflow:hidden;
		background: #F2F2F2;
	}
	.prod-list .item .pic image{
		width: 100%;
		height: 100%;
		display: block;
	}
	.prod-list .item .info{
		width: 470rpx;
	}
	.prod-list .item .info .name{
		font-size: 36rpx;
		color: #000000;
		padding-top: 10rpx;
		padding-bottom: 8rpx;
		text-overflow:ellipsis;
		overflow:hidden;
		white-space:nowrap;
		width: 100%;
	}
	.prod-list .item .info .price{
		font-size: 40rpx;
		color: #f55959;
		margin-bottom: 15rpx;
	}
	.prod-list .item .info .rmb{
		font-size: 30rpx;
		color: #f55959;
		margin-right: 5rpx;
	}
	.prod-list .item .other{
		justify-content: space-between;
	}
	.prod-list .item .other .text{
		color: #b2b2b2;
		font-size: 24rpx;
		background: #eaeaea;
		display: block;
		line-height: 35rpx;
		padding: 0 20rpx;
		border-radius: 10rpx;
	}
	.prod-list .item .other .address{
		color: #b7b7b7;
		font-size: 28rpx;
	}
	.prod-list .item .content{
		padding-top: 10rpx;
		font-size: 28rpx;
	}
</style>
